import Vue from 'vue';

Vue.directive('debounce-click', {
    bind(el, binding) {
        const { value, arg } = binding;
        const callback = typeof value === 'function' ? value : value.handler;
        const delay = arg ? parseInt(arg) : 300;

        const debouncedCallback = Vue.prototype.$debounce(callback, delay);

        el.addEventListener('click', debouncedCallback);
    },
    unbind(el, binding) {
        const { value } = binding;
        const callback = typeof value === 'function' ? value : value.handler;

        el.removeEventListener('click', callback);
    },
});